<template>
  <div class="print-content">
    <h2 style="text-align: center">报名表</h2>
    <div class="item" v-for="item in columns" :key="item.value">
      <div v-if="item.value==='imgUrl'">
        {{ item.label }}:
        <img width="64" height="64" :src="printData[item.value]"/>
      </div>
      <div v-else>{{ item.label+':' + printData[item.value] }}</div>
    </div>
  </div>
</template>

<script>
import signUpEnum from '../../utils/signUpEnum'

signUpEnum.splice(signUpEnum.findIndex(v => v.value === 'pay'), 1)
export default {
  name: 'Index',
  props: {
    printData: {
      type: Object,
      required: true,
      default: () => ({})
    }
  },
  data () {
    return {
      columns: signUpEnum
    }
  },
  methods: {
    print () {
      const signUp = document.querySelector('.print-content')
      const html = "<html><head><meta charset='utf-8' /></head><body>" + signUp.outerHTML + '</body></html>'
      const download = document.createElement('a')
      download.style.display = 'none'
      download.download = this.printData.name + '.doc'
      const blob = new Blob([html], { type: 'application/vnd.ms-word' })
      download.href = URL.createObjectURL(blob)
      document.body.appendChild(download)
      download.click()
      document.body.removeChild(download)
    }
  }
}
</script>

<style lang="less" scoped>
.print-content{
  visibility: hidden;
  /*position: absolute;*/
  /*left: 89999px;*/
  /*z-index: -1;*/
}
</style>
